<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0,viewport-fit=cover">
    <th:block th:include="include :: header('疫情防控信息详情')" />



    <style type="text/css">
        #imgPreview {
            width: 30%;
            height: 120px;
            margin: 10px auto 0px auto;
            border: 1px solid black;
            text-align: center;
        }
        #prompt3 {
            width: 100%;
            height: 120px;
            text-align: center;
            position: relative;
        }
        #img3 {
            height: 100%;
            width: 100%;
        }
        #imgPreview1 {
            width: 30%;
            height: 120px;
            margin: 10px auto 0px auto;
            border: 1px solid black;
            text-align: center;
        }
        #imgPreview2 {
            width: 30%;
            height: 120px;
            margin: 10px auto 0px auto;
            border: 1px solid black;
            text-align: center;
        }
        #prompt4 {
            width: 100%;
            height: 120px;
            text-align: center;
            position: relative;
        }
        #prompt5 {
            width: 100%;
            height: 120px;
            text-align: center;
            position: relative;
        }

        #img4 {
            height: 100%;
            width: 100%;
        }
        #img5 {
            height: 100%;
            width: 100%;
        }
        body {
            font-size: 15px;
        }
        .check-box, .radio-box {
            display: block;
            box-sizing: border-box;
            cursor: pointer;
            position: relative;
            padding-left: 40px;
            padding-right: 15px;
            padding-top: 5px;
            margin-top: 1px;
            margin-left: 15px;
        }
        .form-horizontal .form-group {
            margin-top: 20px;
        }
        .alert {
            padding: 8px;
            margin-bottom: 10px;
            border: 1px solid transparent;
            border-radius: 4px;
        }
    </style>
</head>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <div class="row">
            <div class="col-sm-12">
                <div class="alert alert-info">
                    <span th:text="${yqInfoCollect.deptName}" style="font-weight: bold;font-size: 16px;"></span>
                    <span style="font-weight: bold;font-size: 16px;">防疫日报</span>
                </div>
            </div>
            <div class="col-sm-12">
                <form class="form-horizontal m" id="form-collect-add">
                       <input id="id" name="id" type="hidden" th:value="${yqInfoCollect.id}" />

                    <div class="form-group">
                        <h3 style="font-size: 16px"><label class="col-sm-12"><i class="text-danger">*</i> 安康码状态：</label></h3>
                        <div class="col-sm-8">
                            <div class="radio-box" th:each="dict : ${@dict.getType('akm_status')}">
                                <input type="radio" th:id="${'akmStatus_' + dict.dictCode}" name="akmStatus" th:value="${dict.dictValue}" th:field="${yqInfoCollect.akmStatus}" disabled="disabled">
                                <label th:for="${'akmStatus_' + dict.dictCode}" th:text="${dict.dictLabel}"></label>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <h3 style="font-size: 16px"><label class="col-sm-12"><i class="text-danger">*</i> 安康码截图：</label></h3>
                        <div class="col-sm-8">
                             <input type="hidden" name="akmPath" th:value="${yqInfoCollect.akmPath}" >
                            <!--<div>
                                <input class="form-control" id="akmPath" name="file" type="file">
                            </div>-->
                            <div id="imgPreview">
                                <div id="prompt3">
                                    <img src="#" id="img3" class="pic"/>
                                </div>
                            </div>
                        </div>
                    </div>


                    <div class="col-sm-8" id="outerdiv" style="position:fixed;top:0;left:0;background:rgba(0,0,0,0.7);z-index:2;width:100%;height:100%;display:none;">
                        <div id="innerdiv" style="position:absolute;">
                            <img id="bigimg" style="border:5px solid #fff;" src="" />
                        </div>
                    </div>

                    <div class="form-group">
                        <h3 style="font-size: 16px"><label class="col-sm-12"><i class="text-danger">*</i> 核酸检测时间：</label></h3>
                        <div class="col-sm-8">
                            <div class="input-group date">
                            <input type="text" name="hsTime" class="form-control" th:value="${#dates.format(yqInfoCollect.hsTime, 'yyyy-MM-dd')}"
                                   placeholder="yyyy-MM-dd" id="datetime-picker" disabled="disabled" style="z-index: 1;">
                               <!--  <input name="hsTime" class="form-control" placeholder="yyyy-MM-dd HH:mm:ss" type="text"> -->
                                <span class="input-group-addon"><i class="fa fa-calendar"></i></span>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <h3 style="font-size: 16px"><label class="col-sm-12"> <i class="text-danger">*</i>  两日内核酸检测结果：</label></h3>
                        <div class="col-sm-8">
                            <div class="radio-box" th:each="dict : ${@dict.getType('hs_result')}">
                                <input type="radio" th:id="${'hsResult_' + dict.dictCode}" name="hsResult" th:value="${dict.dictValue}" th:field="${yqInfoCollect.hsResult}" disabled="disabled">
                                <label th:for="${'hsResult_' + dict.dictCode}" th:text="${dict.dictLabel}"></label>
                            </div>
                        </div>
                    </div>

                    <div class="form-group">
                        <h3 style="font-size: 16px"><label class="col-sm-12"><i class="text-danger">*</i>  核酸检测报告截图：</label></h3>
                        <div class="col-sm-8">

                            <input type="hidden" name="hsPath" th:field="${yqInfoCollect.hsPath}">
                            <!--<div>
                                <input class="form-control" id="xcmPath" name="file" type="file">
                            </div>-->
                            <div id="imgPreview2">
                                <div id="prompt5">
                                    <img src="#" id="img5" class="pic"/>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="form-group">
                        <h3 style="font-size: 16px"><label class="col-sm-12"><i class="text-danger">*</i>  行程码14天是否未离肥：</label></h3>
                        <div class="col-sm-8">
                            <div class="radio-box" th:each="dict : ${@dict.getType('is_leave')}">
                                <input type="radio" th:id="${'xcmIsLeave_' + dict.dictCode}" name="xcmIsLeave" th:value="${dict.dictValue}" disabled="disabled" th:field="${yqInfoCollect.xcmIsLeave}">
                                <label th:for="${'xcmIsLeave_' + dict.dictCode}" th:text="${dict.dictLabel}"></label>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <h3 style="font-size: 16px"><label class="col-sm-12"><i class="text-danger">*</i>  行程码截图：</label></h3>
                        <div class="col-sm-8">

                            <input type="hidden" name="xcmPath" th:field="${yqInfoCollect.xcmPath}">
                            <!--<div>
                                <input class="form-control" id="xcmPath" name="file" type="file">
                            </div>-->
                            <div id="imgPreview1">
                                <div id="prompt4">
                                    <img src="#" id="img4" class="pic"/>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <h3 style="font-size: 16px"><label class="col-sm-12"> <i class="text-danger">*</i> 体温是否正常：</label></h3>
                        <div class="col-sm-8">
                            <div class="radio-box" th:each="dict : ${@dict.getType('sys_yes_no')}">
                                <input type="radio" th:id="${'twIsNormal_' + dict.dictCode}" name="twIsNormal" th:value="${dict.dictValue}" th:field="${yqInfoCollect.twIsNormal}"disabled="disabled">
                                <label th:for="${'twIsNormal_' + dict.dictCode}" th:text="${dict.dictLabel}"></label>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <h3 style="font-size: 16px"><label class="col-sm-12">备注：</label></h3>
                        <div class="col-sm-8">
                           <textarea name="twYcReason" class="form-control" disabled="disabled">[[${yqInfoCollect.twYcReason}]]</textarea>
                        </div>
                    </div>
                    <div class="form-group">
                        <h3 style="font-size: 16px"><label class="col-sm-12">审核状态：</label></h3>
                        <div class="col-sm-8">
                            <div th:if="${yqInfoCollect.aduitStatus eq '0'}" >未审核</div>
                            <div th:if="${yqInfoCollect.aduitStatus eq '1'}" style="color: green">通过</div>
                            <div th:if="${yqInfoCollect.aduitStatus eq '2'}" style="color: red">未通过</div>
                        </div>
                    </div>
                    <div id="auditByDiv">
                        <div class="form-group">
                            <h3 style="font-size: 16px"><label class="col-sm-12">审核人：</label></h3>
                            <div class="col-sm-8">
                                <input type="text" disabled class="form-control" id="name" th:value="${auditByName}"/>
                            </div>
                        </div>

                        <div class="form-group">
                            <h3 style="font-size: 16px"><label class="col-sm-12">审核时间：</label></h3>
                            <div class="col-sm-8">
                                <input type="text" disabled class="form-control" id="name" th:value="${#dates.format(yqInfoCollect.aduitTime, 'yyyy-MM-dd HH:mm')}"/>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <div class="row" th:if="${yqInfoCollect.aduitStatus} eq '0'">
        <div class="col-sm-12" style="text-align: center">
        	<button  class="btn btn-primary"  id="editBtn1" onclick="edit()">重新修改</button>
        	<br>
        	<br><br>
        </div>
    </div>
    <div class="row" th:if="${yqInfoCollect.aduitStatus} eq '2'">
        <div class="col-sm-12" style="text-align: center">
            <button  class="btn btn-primary" id="editBtn2" onclick="edit()">重新修改</button>
            <br>
            <br><br>
        </div>
    </div>
    <th:block th:include="include :: footer" />

<script>


    var now = new Date();
    var year = now.getFullYear(); //年
    var month = now.getMonth() + 1; //月
    var day = now.getDate(); //日
    var hour = now.getHours(); //小时
    var order_time = `${year}-${month}-${day} ${hour}:00:00`;

    // 日期选择控件
    var yearList = [String(year-1),String(year)];
    var monthList = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"];
    var dayList = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "17", "18",
        "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30", "31"
    ];

    var dataList = [];
    var index = 0;
    for (var i = 0; i < yearList.length; i++) {
        // if (year <= +yearList[i]) {
        var a = {};
        a.value = yearList[i];
        a.label = `${yearList[i]}年`;
        index++;
        a.children = [];
        for (var j = 0; j < monthList.length; j++) {
            var b = {};
            b.label = `${monthList[j]}月`;
            b.value = monthList[j];
            index++;
            if (year == +yearList[i]) {
                //if (month - 1 <= j) {
                a.children[a.children.length] = b;
                //}
            } else {
                a.children[a.children.length] = b;
            }
            b.children = [];
            for (var o = 0; o < dayList.length; o++) {
                var c = {};
                c.label = `${dayList[o]}日`;
                c.value = dayList[o];
                index++;
                if (month == +monthList[j]) {
                    //if (day - 1 <= o) {
                    b.children[b.children.length] = c;
                    // }
                } else {
                    b.children[b.children.length] = c;
                }
                c.children = [];

                if (j + 1 == 4 || j + 1 == 6 || j + 1 == 0 || j + 1 == 11) {
                    if (o == 29) o = 31;
                } else if (j + 1 == 2) {
                    if (
                        (+yearList[i] % 4 == 0 && +yearList[i] % 100 != 0) ||
                        +yearList[i] % 400 == 0
                    ) {
                        if (o == 28) o = 31;
                    } else {
                        if (o == 27) o = 31;
                    }
                }
            }
        }
        dataList[dataList.length] = a;
        // }
    }
    var appointment = '';
    $('.icon-picker').click(function () {
        $("#datetime-picker").click();
    })

    $("#datetime-picker").click(function () {
        weui.picker(dataList, {
            className: "custom-classname",
            container: "body",
            defaultValue: [year, month, day, hour],
            onChange: function (result) {},
            onConfirm: function (result) {
                appointment = result[0] + "-" + result[1] + "-" + result[2] ;
                $("#datetime-picker").val(appointment)
                order_time = `${result[0]}-${result[1]}-${result[2]}`
            },
            id: "datetime-picker"
        });
    });

    function edit(){
    	var id=$("#id").val();
    	 window.location.href = ctx + "wxcp/epidemic/collect/edit/"+id;
    }
</script>
    <script th:inline="javascript">
        var prefix = ctx + "wxcp/epidemic/collect"

        //加载图片
        $(function () {

            var imgPath3 = [[${yqInfoCollect.akmPath}]];
            var imgPath4 = [[${yqInfoCollect.xcmPath}]];
            var imgPath5 = [[${yqInfoCollect.hsPath}]];
            $("#img3").attr("src", imgPath3);
            $("#img4").attr("src", imgPath4);
            $("#img5").attr("src", imgPath5);

            $(".pic").click(function(){
                var _this = $(this);//将当前的pimg元素作为_this传入函数
                imgShow("#outerdiv", "#innerdiv", "#bigimg", _this);
            });

            //根据审核状态是否通过，显示隐藏‘修改’按钮
            var isAudited = [[${yqInfoCollect.aduitStatus}]];
            if (isAudited == '0') {
                $("#auditByDiv").attr("style","display:none;");
            }
            if (isAudited == '1') {
                $("#editBtn1").attr("style","display:none;");
                $("#editBtn2").attr("style","display:none;");
            }
        })

        function imgShow(outerdiv, innerdiv, bigimg, _this){
            var src = _this.attr("src");//获取当前点击的pimg元素中的src属性
            $(bigimg).attr("src", src);//设置#bigimg元素的src属性

            /*获取当前点击图片的真实大小，并显示弹出层及大图*/
            $("#bigimg").on('load',function(){
                var windowW = $(window).width();//获取当前窗口宽度
                var windowH = $(window).height();//获取当前窗口高度
                var realWidth = this.width;//获取图片真实宽度
                var realHeight = this.height;//获取图片真实高度
                var imgWidth, imgHeight;
                var scale = 0.8;//缩放尺寸，当图片真实宽度和高度大于窗口宽度和高度时进行缩放

                if(realHeight>windowH*scale) {//判断图片高度
                    imgHeight = windowH*scale;//如大于窗口高度，图片高度进行缩放
                    imgWidth = imgHeight/realHeight*realWidth;//等比例缩放宽度
                    if(imgWidth>windowW*scale) {//如宽度扔大于窗口宽度
                        imgWidth = windowW*scale;//再对宽度进行缩放
                    }
                } else if(realWidth>windowW*scale) {//如图片高度合适，判断图片宽度
                    imgWidth = windowW*scale;//如大于窗口宽度，图片宽度进行缩放
                    imgHeight = imgWidth/realWidth*realHeight;//等比例缩放高度
                } else {//如果图片真实高度和宽度都符合要求，高宽不变
                    imgWidth = realWidth;
                    imgHeight = realHeight;
                }
                $(bigimg).css("width",imgWidth);//以最终的宽度对图片缩放

                var w = (windowW-imgWidth)/2;//计算图片与窗口左边距
                var h = (windowH-imgHeight)/2;//计算图片与窗口上边距
                $(innerdiv).css({"top":h, "left":w});//设置#innerdiv的top和left属性
                $(outerdiv).fadeIn("fast");//淡入显示#outerdiv及.pimg
            })

            $(outerdiv).click(function(){//再次点击淡出消失弹出层
                $(this).fadeOut("fast");
            });
        }

    </script>
</body>
</html>
